<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core" 
      xmlns:p="http://primefaces.org/ui" xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <base href="#{request.contextPath}/" />
        <title><h:outputText value="Society - Perfil de #{usuarioMB.us.nome}" /></title>
        <link type="text/css" href="css/home2.css" rel="stylesheet" />
    </h:head>
    <h:body>
        <p:panel id="body" styleClass="painel">
            <ui:insert name="titulo" >

                <p:panel id="titulo" styleClass="painel">
                    <p:panel id="title" styleClass="painel">
                        <p:graphicImage value="css/img/logo8.png" id="logo" alt="imagem titulo" styleClass="logo"/>
                    </p:panel>
                    <p:panel id="links" styleClass="painel" >
                        <h:link value="Home" outcome="home" />
                        <h:link value="Profile" outcome="home" />
                        <h:link value="Albums" outcome="home" />
                        <h:link value="Messages" outcome="home" />
                    </p:panel>
                </p:panel>
            </ui:insert>
            <ui:insert name="pessoal" >
                <p:panel id="usuario" styleClass="painel">
                    <h:outputLabel value="#{usuarioMB.us.mensagem}"  title="Mensagem do perfil" />
                    <br />
                    <p:graphicImage width="128px" height="128px" value="#{usuarioMB.us.fotoPerfil}" id="photoProfile" />
                    <br />
                    <h:outputLabel value="#{usuarioMB.us.nome} #{usuarioMB.us.sobrenome}" />
                    <br />
                    <h:outputLabel value="#{usuarioMB.data}" />
                    <br />
                    <h:outputLink value="j_spring_security_logout" styleClass="usuario_conteudo">Logout</h:outputLink>
                    <br />
                    <h:outputLabel value="#{usuarioMB.us.cidade}" />
                    <br />
                    <h:outputLabel value="#{usuarioMB.us.estado} - #{usuarioMB.us.pais}" />
                </p:panel>
            </ui:insert>
            <ui:insert name="content">
                <p:panel styleClass="painel centro" id="centro">
                    <h:form prependId="false" id="form">
                        <p:dataTable emptyMessage="Você não possui atualizações" id="atualizacoes" value="#{usuarioMB.us.atualizaçoes}" var="atualizacao" paginator="true" rows="10"  
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"  
                                     paginatorPosition="bottom" paginatorAlwaysVisible="false"
                                     >
                            <f:facet name="header" >
                                Atualizações
                            </f:facet>
                            <p:column>
                                <p:panel id="panelAtl" >
                                    <p:graphicImage id="imgAtl" value="#{atualizacao.userPublica.fotoPerfil}" width="35px" height="35px" />
                                    <p:panel styleClass="painelAtl">
                                        <h:outputLabel value="#{atualizacao.userPublica.nome} #{atualizacao.userPublica.sobrenome}" />
                                        <br /><h:outputText value="#{atualizacao.alvo}" />
                                    </p:panel>
                                </p:panel>
                            </p:column>
                        </p:dataTable>
                    </h:form>                    
                </p:panel>
            </ui:insert>  
            <ui:insert name="direita" >
                <p:panel id="amigos" >
                    <h:form prependId="false" style="width: 100%">
                        <p:dataTable emptyMessage="Você não possui atualizações" id="amigos_datatable" value="#{usuarioMB.us.amigos}" var="amigo" paginator="true" rows="10"  
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"  
                                     paginatorPosition="bottom" paginatorAlwaysVisible="false"
                                     >
                            <f:facet name="header">
                                Amigos
                            </f:facet>
                            <p:column >
                                <p:panel styleClass="painel_amigos" >
                                    <p:graphicImage value="#{amigo.fotoPerfil}" width="45px" height="45px"/>
                                    <br />
                                    <p:panel styleClass="usNome">
                                        <h:outputLabel value="alexandrealexandreaa"/>
                                    </p:panel>
                                </p:panel>
                            </p:column>
                            <p:column >
                                <p:panel styleClass="painel_amigos" >
                                    <p:graphicImage value="#{amigo.fotoPerfil}" width="45px" height="45px" />
                                    <br />
                                    <p:panel styleClass="usNome">
                                        <h:outputLabel value="#{amigo.nome}"/>
                                    </p:panel>
                                </p:panel>
                            </p:column>
                            <p:column >
                                <p:panel styleClass="painel_amigos" >
                                    <p:graphicImage value="#{amigo.fotoPerfil}" width="45px" height="45px" />
                                    <br />
                                    <p:panel styleClass="usNome">
                                        <h:outputLabel value="#{amigo.nome}aaaaaaaaaa"/>
                                    </p:panel>
                                </p:panel>
                            </p:column>
                        </p:dataTable>
                    </h:form>
                </p:panel>
            </ui:insert>  
        </p:panel>
    </h:body>
</html>